// component/senior/tabs/tabs.js
const themes = {
  smallBar: 'smallBar'
}

Component({
  /**
   * 组件的属性列表
   */
  properties: {
    items: {
      type: Array,
      value: ['item1', 'item2', 'item3', 'item4'],
      observer: function (newVal) {
        if (newVal) {
          let sw = wx.getSystemInfoSync().screenWidth;
          let iw=0,mrl=0,left=0;
          let arry=[]
          for (var index in newVal){
            // iw = newVal.length < 7 ? sw / newVal.length:(newVal[index].length * 14 + 30)
            iw = (newVal[index].length * 20+50)
            let dom = new Object();
            dom.left = left;
            // dom.right = index * iw + iw;
            dom.itemw=iw;
            dom.name = newVal[index];
            left += iw;
            arry.push(dom);
            // if(index==0){
            //   mrl = dom.left + ((iw-30)/2)
            // }
          }
          this.setData({
            domData:arry,
            left: mrl
          })
        }
      }
    },
    height: {
      type: String,
      value: '80'
    },
    textColor: {
      type: String,
      value: '#5E5E5E'
    },
    textSize: {
      type: String,
      value: '28'
    },
    selectColor: {
      type: String,
      value: '#F5415C'
    },
    selected: {
      type: String,
      value: '0',
      observer: function (newVal) {
        this.setData({
          mSelected: newVal
        })
        this.onItemTap({ currentTarget: { dataset: { index: newVal } } })
      }
    },
    
    dataCus: {
      type: Array,
      value: '',
      observer: function (newVal) {
        this.setData({
          mDataCus: newVal
        });
      }
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    itemWidth: 100,
    isScroll: true,
    scrollStyle: 'border-bottom: 1px solid #F0F0F0;',
    left: '0',
    bottom: '0',
    mSelected: '0',
    lastIndex: 0,
    // transition: 'left 0.5s, right 0.2s',
    windowWidth: 375,
    domData: [],
    textDomData: [],
    mDataCus: []
  },

  externalClasses: ['cus'],

  /**
   * 组件的方法列表
   */
  methods: {
    barLeft: function(index, dom) {
      let that = this;
      console.log("位置左：", dom[index].itemw)
      let myl = index == 0 ? dom[index].left + ((dom[index].itemw - 30) / 2) : dom[index].left
      dom[index] && this.setData({
        left: dom[index].left + ((dom[index].itemw - 30) / 2)
      })
    },
    onItemTap: function(e) {
      const index = e.currentTarget.dataset.index;
      let str = this.data.lastIndex < index ? 'left 0.5s' : 'left 0.2s';
      this.setData({
        transition: str,
        lastIndex: index,
        mSelected: index
      })
      {
        this.barLeft(index, this.data.domData);
      }
      this.triggerEvent('itemtap', e, { bubbles: true });
    }
  },

  
})
